<template>
  <div>{{retrieveNum}}<br>
    <button @click="retrieve()">retrieve</button><br>
     <input type="text" v-model="value"><button @click="store()">提交</button>
  </div>

</template>

<script>
import { ethers } from "ethers";  //version 5
import BoxContractABI from "@/assets/abijson/Box.json";
//import  ethers  from 'ethers';
export default {
  data() {
    return {
      counterAddress: "0xed6BDf6FdF48f647841461DB8A46f09a85006149",
      contract: null,
      sigContract:null,
      retrieveNum: null,
      value:null
    };
  },
  created() {
    this.initContract();
  },
  methods: {
    async initContract() {
      const provider = new ethers.providers.JsonRpcProvider(
        "http://localhost:7545"
      );
      this.contract = new ethers.Contract(
        this.counterAddress,
        BoxContractABI.abi,
        provider
      );
      //签名
      const signer = provider.getSigner()
      this.sigContract = new ethers.Contract(
        this.counterAddress,
        BoxContractABI.abi,
        signer
      );
    },
    //读取
    async retrieve() {
      const aa = await this.contract.retrieve();
      this.retrieveNum = aa;
    },
    //写 需要签名
    async store() {
      const transactionResponse = await this.sigContract.store(this.value);
      const receipt = await transactionResponse.wait();
      console.log(receipt);
      this.retrieve()
    },
  },
};
</script>

<style>
</style>